{% extends "base.html" %}
{% block meta %}
    <link type="text/css" href="css/ui-lightness/jquery-ui-1.8.17.custom.css" rel="stylesheet" />   
    <script type="text/javascript" src="/js/jquery-1.7.1.min.js"></script>
    <script type="text/javascript" src="/js/jquery-ui-1.8.17.custom.min.js"></script>
    <script type="text/javascript" src="/js/ui/i18n/jquery.ui.datepicker-ru.js"></script>
    <script type="text/javascript">
        $(function(){
            $('#datepicker').datepicker({inline: true });
            $('#dialog_link, ul#icons li').hover(
                function() { $(this).addClass('ui-state-hover'); }, 
                function() { $(this).removeClass('ui-state-hover'); }
            );
            
        });
    </script>
    <!--style type="text/css">
        /*demo page css*/
        body{ font: 62.5% "Trebuchet MS", sans-serif; margin: 50px;}
        .demoHeaders { margin-top: 2em; }
        #dialog_link {padding: .4em 1em .4em 20px;text-decoration: none;position: relative;}
        #dialog_link span.ui-icon {margin: 0 5px 0 0;position: absolute;left: .2em;top: 50%;margin-top: -8px;}
        ul#icons {margin: 0; padding: 0;}
        ul#icons li {margin: 2px; position: relative; padding: 4px 0; cursor: pointer; float: left;  list-style: none;}
        ul#icons span.ui-icon {float: left; margin: 0 4px;}
    </style-->    
    <script> 
    </script> 
{% endblock %}
{% block content %}
<table><tr><td>
    <form action="" method="get">
        <label for="datepicker">Выбор даты:</label><input type="text" name="date" id="datepicker" value="{{date}}" onchange="this.parentNode.submit();"/>
    </form>
    </td><td>
    <form action="" method="POST" id="prodinf_form"> {% csrf_token %}
        <input type="hidden" name="data_date" id="id_date" value="">
        <label for="id_index">Записать данные:</label>
        <select name="index" id="id_index">
            {% for one in PRODUCTION_TYPES %}
                <option value="{{one.0}}">{{one.1}}</option>
            {% endfor %}
        </select>
        <label for="id_volume">Объем:</label>
        <input type="text" value="" name="volume" id="id_volume" style="width: 80px;">
        <input type="submit" value="Сохранить" onsubmit="submit_prodinf(); return false;">
        <script type="text/javascript">
            function submit_prodinf() {
                document.getElementById('id_date').value = document.getElementById('datepicker').value;
                document.forms['prodinf_form'].submit();
            };
        </script>
    </form>
</td></tr></table>
    <h3>Месяц {{ month_name }} {{ year }}г.</h3>
    <style>
    </style>
    <table width=600 class="data">
        <tr>
            <th></th>
            {% for one in PRODUCTION_TYPES %}
                <th>{{ one.1 }}</th>
            {% endfor %}
            <th>Итого</th>
        </tr>

        {% for day_num, row in data.items %}
            <tr class="{% cycle 'hl1' 'hl2' %}{% if day == day_num %} selected{%endif%}" {>
                <th>{{ day_num }}</th>
                {% for value in row %}
                    <td {% if forloop.last %}style="font-weight: bolder;"{%endif%}>{{ value }}</td>
                {% endfor %}
            </tr>
        {% endfor %}
        <tr class="hl2"><th>Итого:</th>
                {% for value in totals %}
                    <th>{{ value }}</th>
                {% endfor %}
        </tr>
    </table>

{% endblock %}
